<template>
  <div style="height:50%">
    <el-row type="flex" :gutter="20">
      <el-col :span="6">
        <distribution :title="'冲煮沸锅顶水量的过程能力'"></distribution>
      </el-col>

      <el-col :span="6">
        <el-row type="flex" align="middle" :gutter="6">
          <el-col :span="6">
            <data-card :title="'过程数据'" :items="processItems"></data-card>
          </el-col>
          <el-col :span="6">
            <data-card :title="'整体能力'" :items="totalItems"></data-card>
          </el-col>
        </el-row>

        <el-row type="flex" align="" :gutter="6">
          <el-col :span="6">
            <data-card :title="'实测性能'" :items="actualItems"></data-card>
          </el-col>
          <el-col :span="6">
            <data-card :title="'预期整体性能'" :items="expectItems"></data-card>
          </el-col>
        </el-row>
      </el-col>
    </el-row>

    <el-row type="flex" :gutter="20">
      <el-col :span="6">
        <box :title="'盒须图'"></box>
      </el-col>

      <el-col :span="6">
        <i-m-r :title="'I-MR图'"></i-m-r>
      </el-col>
    </el-row>
  </div>
</template>

<style scoped>
  .el-row {
    margin-bottom: 20px;
  }

  .el-row:last-child {
    margin-bottom: 0;
  }

  .el-col {
    width: 100%;
    border-radius: 4px;
  }
</style>

<script>
  import Distribution from './components/Distribution';
  import DataCard from './components/DataCard';
  import Box from './components/Box';
  import IMR from './components/I-MR';

  export default {
    components: {
      Distribution,
      DataCard,
      Box,
      IMR
    },
    data() {
      return {
        processItems: [
          {key: "LSL", value: 0},
          {key: "目标", value: 28},
          {key: "USL", value: 33},
          {key: "样本均值", value: 30.8372},
        ],
        totalItems: [
          {key: "PP", value: 1.91},
          {key: "PPL", value: 10.03},
          {key: "PPU", value: 0.19},
          {key: "PPK", value: 0.19},
        ],
        actualItems: [
          {key: "PPM<LSL", value: 0.00},
          {key: "PPM>USL", value: 83720.93},
          {key: "PPM合计", value: 83720.93},
        ],
        expectItems: [
          {key: "PPM<LSL", value: 0.00},
          {key: "PPM>USL", value: 96110.31},
          {key: "PPM合计", value: 96110.31},
        ]
      }
    }
  }
</script>


